﻿<!DOCTYPE html>
<html>
<head>
    <title>{$platform.name}</title>
    <link href="/static/css/framework-font.css" rel="stylesheet"/>
    <script src="/static/js/jquery-2.1.1.js"></script>
    <script src="/static/bootstrap/js/bootstrap.js"></script>
    <link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet"/>

    <script src="/static/js/jquery.cookie.js"></script>
    <link href="/static/css/framework-theme.css" rel="stylesheet"/>
    <script src="/static/js/framework-ui.js"></script>
    <script src="/static/js/framework-clientdata.js"></script>
    <!--弹框js-->
    <script src="/static/js/yii.js"></script>
    <!--引用layui弹框插件-->
    <script src="/static/layui/layui.all.js"></script>
    <script src="/static/layui/layui.js"></script>
    <link href="/static/layui/css/layui.css" rel="stylesheet"/>
    <script src="/static/layui/lay/modules/layer.js"></script>
    <!--开关主键-->
    <script src="/static/bootstrap/bootstrap-switch.js"></script>
    <link href="/static/bootstrap/bootstrap-switch.css" rel="stylesheet"/>
    <!--    配置select多选相关-->
    <script src="/static/layui/dist/xm-select.js"></script>
        {if condition="$swidthStyle eq 0"}
    <link href="/static/css/pattern/public.css" rel="stylesheet"/>
    {else/}
    <link href="/static/css/default/public.css" rel="stylesheet"/>
    {/if}
</head>
<body>
<style>
    .new_main{min-height:750px!important;}
    .layui-form-label{width:90px!important;}
    .article_left{width:15%;float: left;height:100%;border-right:1px solid #ccc;position:absolute;background-color: #1e222d}
    .article_left h3{font-size:14px;text-align: center;line-height:35px;background-color: #262626;color:#fff;}
    .article_left ul li{font-size:12px;text-align: left;line-height:35px;border-bottom:1px solid #ccc;color:#fff;padding-left:15px}
    .article_left ul li .subtopic li{border:0px;}
    .article_left ul li .subtopic li a{color:#fff;}
    .subtopic{display: none;}

    .article_right{width:85%;float: right;
        width: 85%;
        height: 100%;
        float: right;
        position: absolute;
        right: 0px;
    }
    .article_right iframe{border:0px;min-height: 700px;}

</style>

<div class="newtest">

<!--    <div class="container new_serach">-->
<!--        <form class="form-horizontal layui-form" method="get">-->
<!--            <div class="serach_div form-group">-->
<!--                <button class="btn btn-danger btn-sm">筛选</button>-->
<!--            </div>-->
<!--        </form>-->
<!--        <div>-->
<!--            <a class="btn btn-primary btn-sm" href="javascript:;" id="add_btn">添加分类</a>-->
<!--        </div>-->
<!--    </div>-->


        <div class="layui-form-item layui-form">
            <label class="layui-form-label">切换景区</label>
            <div class="col-sm-2">
                <select name="colony_id" lay-verify="colony_id" lay-filter="colony_id" class="select"
                        lay-search="">
                    {volist name="colony" id="vo"}
                    <option value="{$vo.id}" {if condition="$colonyId eq $vo['id']"} selected {/if} >{$vo.name}</option>
                    {/volist}
                </select>
            </div>
        </div>




    <div class="new_main">

            <!--菜单栏-->
            <div class="article_left">
                <h3>栏目管理</h3>
                <ul>

                    {volist name="nav" id="vo"}
                    <li class="parent">
                        {$vo.name}
                        <ul class="subtopic">
                            {volist name="$vo['classify']" id="vo1"}
                            <li>
                                <a class="subtopic_a" data-id="{$vo1.id}" data-type="{$vo1.type}" data-colony="{$colonyId}" href="javascript:;">{$vo1.name}</a>
                            </li>
                            {volist name="$vo1['subtopic']" id="vo2"}
                            <li>
                                <a class="subtopic_a" data-id="{$vo2.id}" data-type="{$vo2.type}" data-colony="{$colonyId}" href="javascript:;">--{$vo2.name}</a>
                            </li>
                            {/volist}
                            {/volist}
                        </ul>

                    </li>
                    {/volist}

                </ul>
            </div>


            <!--内容展示栏目-->
            <div class="article_right">
                <iframe id="mainContent" width="100%" height="100%"></iframe>
            </div>


<!--        <table class="table">-->
<!--            <thead>-->
<!--            <tr>-->
<!--                <th scope="col">ID</th>-->
<!--                <th scope="col">分类名称</th>-->
<!--                <th scope="col">关联景区</th>-->
<!--                <th scope="col">所属栏目</th>-->
<!--                <th scope="col">分类模型</th>-->
<!--                <th scope="col">排序</th>-->
<!--                <th scope="col">状态</th>-->
<!--                <th scope="col">操作</th>-->
<!--            </tr>-->
<!--            </thead>-->

<!--            <tbody>-->

<!--            {volist name="list" id="vo"}-->
<!--            <tr>-->
<!--                <td>{$vo.id}</td>-->
<!--                <td>{$vo.name}</td>-->
<!--                <td>{$vo.propertyName}</td>-->
<!--                <td>{$vo.c_name}</td>-->
<!--                <td>{$vo.type}</td>-->
<!--                <td>{$vo.sort}</td>-->
<!--                <td>{$vo.status}</td>-->
<!--                <td>-->
<!--                    <a class="btn-sm btn-primary js_update" data-id="{$vo.id}">修改</a>-->
<!--                    <a class="btn-sm btn-danger receive" data-id="{$vo.id}" data-title="提示" data-msg="是否确定操作" data-operation="newsave">删除</a>-->
<!--                </td>-->
<!--            </tr>-->
<!--            {/volist}-->

<!--            </tbody>-->
<!--        </table>-->

<!--        <div class="newpage"></div>-->
    </div>
</div>


</body>
<script src="/static/js/index.js"></script>
<script src="/static/js/indextab.js"></script>
<script src="/static/js/pace.min.js"></script>
<script>
    $(".article_left").on("click", ".parent", function(e) {
        $(".subtopic").hide(1000);
        $(this).find(".subtopic").toggle(1000);
    })

    $(".subtopic").click(function(event){
        event.stopPropagation();//阻止事件冒泡即可
    });


    var mainContent = document.getElementById('mainContent');
    mainContent.src = "{:URL('community/Content/index')}?colony_id={$colonyId}";//嵌套网址
    $(".subtopic_a").click(function () {
        var classifyId = $(this).attr("data-id");
        var type = $(this).attr("data-type");
        if(type==2){
            mainContent.src = "{:URL('community/Party/index')}?classify_id="+classifyId//嵌套网址
        }else if(type==8){
            mainContent.src = "{:URL('community/Message/index')}?classify_id="+classifyId//嵌套网址
        }else if(type==10){
            mainContent.src = "{:URL('community/Exchange/index')}?classify_id="+classifyId//嵌套网址
        }else{
            mainContent.src = "{:URL('community/Content/index')}?classify_id="+classifyId//嵌套网址
        }
    });


    var modal = new yii.modal();

    layui.use(['form', 'jquery', 'layer', 'laydate'], function () { //独立版的layer无需执行这一句
        var $ = layui.jquery, layer = layui.layer;
        var form = layui.form;
        var laydate = layui.laydate;
        //日期范围
        laydate.render({
            elem: '#test6'
            , range: true
        });

        //获取栏目
        form.on('select(colony_id)', function (data) {
            //触发联动
            var id = data.value;

            //执行跳转
            location.href="{:URL('community/Article/lists')}?colonyId="+id;

        });


    });


</script>

</html>
